<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>订单列表</title>
<link rel="stylesheet" href="__PUBLIC__/{:C('ADDONS')}plugins/layui/css/layui.css" media="all" />
<link rel="stylesheet" href="__PUBLIC__/{:C('ADDONS')}css/global.css" media="all">
<link rel="stylesheet" href="__PUBLIC__/{:C('ADDONS')}plugins/font-awesome/css/font-awesome.min.css">
</head>
<body>
<div class="admin-main">
<fieldset class="layui-elem-field">
<legend>查询</legend>
<div class="layui-field-box">
<form class="layui-form">
<div class="layui-form-item">
    <div class="layui-inline">
      <div class="layui-input-inline">
      <select name="paytype" lay-filter="aihao">
        <option value="0" selected="">全部</option>
        <option value="1">未完成</option>
        <option value="2" selected="">已付款</option>
        <option value="5">发货中</option>
        <option value="3">已发货</option>
        <option value="6">已收货</option>
        <option value="4">已取消</option>
      </select>
    </div><div class="layui-input-inline">
      <select name="billtype" lay-filter="aihao">
        <option value="-1" selected="">全部</option>
        <option value="0">线上</option>
        <option value="2">线下</option>
        <option value="1">待定</option>
      </select>
    </div>
      <div class="layui-input-inline">
        <input placeholder="查询会员号" type="text" name="user_name" autocomplete="off" class="layui-input">
      </div>
      <div class="layui-input-inline">
      <input class="layui-input" name="start_time" placeholder="开始" id="LAY_demorange_s">
    	</div>
    <div class="layui-input-inline">
      <input class="layui-input" name="end_time" placeholder="截止" id="LAY_demorange_e">
    </div>
	</div>
<div class="layui-form-item">
	<div class="layui-input-inline">
      <input class="layui-input" name="order_sn" placeholder="订单号">
    </div>
	<div class="layui-input-inline">
      <input class="layui-input" name="buy_name" placeholder="收货人/购买人">
    </div>
    <div class="layui-input-inline">
      <select name="sell_depart" lay-filter="aihao">
        <option value="999999" selected="">全部</option>
        <volist name="door" id="vo">
        <option value="{$vo.depart_id}" >{$vo.depart_name}</option>
        </volist>
      </select>
    </div>
      <button class="layui-btn" lay-submit lay-filter="search">查询</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
      <a class="layui-btn layui-btn-primary" href="#here" id="downLoadLink">下载</a>
    </div>
  </div>
  <input type="text" id="currentpage" value="1" style="display:none;"/>
</form>
</div>
</fieldset>
<fieldset class="layui-elem-field">
	<legend> 列表 </legend>
	<div class="layui-field-box" id="contentlist"></div>
</fieldset>
<div class="admin-table-page">
    <div id="demo7" class="page" style="text-align:center;"></div>
    <input id="curpage" value="1" 	style="display:none;"/>
    <input id="orderpage" value="" style="display:none;"/>
</div>
</div>
<div class="viewbilldetail" id="viewlayer" style="display:none;">0</div>
<style type="text/css">
.viewbilldetail{
    position: fixed;
    top: 10%;
    left: 50px;
    background-color: transparent;
    width: 80%;
	border: 2px solid green;
}
</style>
<input type="text" style="display:none;" value="0" id="vieworderid"/>
<script type="text/javascript" src="__PUBLIC__/{:C('ADDONS')}plugins/layui/layui.js"></script>
<script>
/* 订单查询条件 */
layui.use(['laypage','layer','form','laydate'], function() {
    var form = layui.form(),laypage = layui.laypage,
    $ = layui.jquery
    var searchData 	= {};
    var currentPage;
    var totalPage 	= {$pages};
    var requestType = 0;
    var tt = '__PUBLIC__';
    var downLoadUrl = '{:U("Admin/Bill/downLoadDetail")}';
    var changePage 	= function(curr){
        var url = "{:U('Bill/listDetailTable')}";
        searchData.page = curr;
	$.post(url,searchData, function(res){
            // 此处仅仅是为了演示变化的内容
            $('#contentlist').html(res);
            totalPage = $('#listTotalPage').val();
            // 显示分页
            laypage({
		cont: 'demo7', //容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<div id="page1"></div>
		pages: totalPage, //通过后台拿到的总页数
		curr: curr || 1, //当前页
		jump: function(obj, first){ //触发分页后的回调
		if(!first){ //点击跳页触发函数自身，并传递当前页：obj.curr
                    changePage(obj.curr);
		}
		}
            });
	});
    };
    /* 表单提交 */
    form.on('submit(search)', function(data){
	var formInfo = data.field;
        searchData = data.field;
        var url = "{:U('Bill/listDetailTable')}";
        var page = $('#currentpage').val();
        formInfo.page = page;
        changePage(page);
	return false;
    });
    $('#downLoadLink').click(function(){
        $.post(downLoadUrl,searchData,function(data){
			location.href = tt + data.data.content;
		});
    });
	//编辑用户mouseover
    $(document).delegate('.viewbill', 'mouseover',function(){
		var id = $(this).attr('data');
		var oldid = $('#vieworderid').val();
		if(id==oldid){
			$('#viewlayer').show();
		}else{
			var url = "{:U('Bill/mouseView')}";
			$('#vieworderid').val(id);
			$.get(url,{id:id},function(data){
				if(data.status == 'error'){
					layer.msg(data.msg,{icon: 5});
					return;
				}
				$('#viewlayer').html(data);
				$('#viewlayer').show();
			})
		}
	});
	$(document).delegate('.viewbill', 'mouseout',function(){
		$('#viewlayer').hide();
	});
	$(document).delegate('.viewlayer', 'click',function(){
		$('#viewlayer').hide();
	});
    $(document).delegate('.edit', 'click',function(){
					var id = $(this).attr('data');
					var url = "{:U('Style/edit')}";
					$.get(url,{id:id},function(data){
						if(data.status == 'error'){
							layer.msg(data.msg,{icon: 5});
							return;
						}
						layer.open({
							  title:'编辑图片',
							  type: 1,
							  skin: 'layui-layer-rim', //加上边框
							  area: ['800px','500px'], //宽高
							  content: data,
						});
					})
				 });
				// 海报预览
				$(document).delegate('.view', 'click',function(){
                	var id = $(this).attr('data');
					layer.open({
  							title: '查看图片'
                            ,area: ['420px','320px']
  							,content: '<img width="400" height="276" src="'+id+'">'
						}); 
                });
				/* 复制 */
                $(document).delegate('.copy', 'click',function(){
                	var id = $(this).attr('data');
                	var url = "{:U('Style/xcopy')}";
                	$.get(url,{id:id},function(data){
                    	if(data.status == 'error'){
							layer.msg(data.msg,{icon: 5});
							return;
						}
                        location.reload();
                    });
                });
				//删除
                $(document).delegate('.del', 'click',function(){
					var id = $(this).attr('data');
					var url = "{:U('Style/del')}";
					layer.confirm('确定删除吗?', {
						  icon: 3,
						  skin: 'layer-ext-moon',
						  btn: ['确认','取消'] //按钮
						}, function(){
							$.post(url,{id:id},function(data){
								if(data.status == 'error'){
									  layer.msg(data.msg,{icon: 5});//失败的表情
									  return;
								  }else{
									  layer.msg(data.msg, {
										  icon: 6,//成功的表情
										  time: 1000 //2秒关闭（如果不配置，默认是3秒）
										}, function(){
										   location.reload();
										}); 
								  }	
							})
					  });
				});
    changePage();
        /* 开始时间 */
    var start = {
    	min: '2010-06-16 23:59:59'
    	,max: '2099-06-16 23:59:59'
    	,istoday: false
    	,choose: function(datas){
      		end.min = datas; //开始日选好后，重置结束日的最小日期
      		end.start = datas //将结束日的初始值设定为开始日
    	}
  	};
    /* 结束时间 */
  	var end = {
    	min: laydate.now()
    	,max: '2099-06-16 23:59:59'
    	,istoday: false
    	,choose: function(datas){
      	start.max = datas; //结束日选好后，重置开始日的最大日期
    	}
  	};
    /* 开始输入框 */
  	document.getElementById('LAY_demorange_s').onclick = function(){
    	start.elem = this;
    	laydate(start);
  	}
    /* 结束输入框 */
  	document.getElementById('LAY_demorange_e').onclick = function(){
    	end.elem = this
    	laydate(end);
  	}
});
</script>
</body>
</html>